<template>
    <div>
        <el-card>
            <div slot="header">
                <el-tabs v-model="tableFrom.type" @tab-click="switchGetList">
                    <el-tab-pane name="1" label="我分享的"></el-tab-pane>
                    <el-tab-pane label="分享给我的" name="2"></el-tab-pane>
                </el-tabs>
            </div>
            <div>
                <el-table :data="sharingList" style="width: 100%" size="mini">
                    <el-table-column label="商品图" min-width="80">
                        <template slot-scope="scope">
                            <div class="demo-image__preview">
                                <el-image :src="scope.row.product.image" :preview-src-list="[scope.row.image]" />
                            </div>
                        </template>
                    </el-table-column>
                    <el-table-column prop="product.store_name" label="商品名称" width="240">
                    </el-table-column>
                    <el-table-column prop="product.price" label="商品售价" min-width="90">
                    </el-table-column>
                    <el-table-column prop="merchant.mer_name" label="分享商户" min-width="120">
                        <template slot-scope="scope">
                            {{ tableFrom.type == 1 ? scope.row.merchant.mer_name : scope.row.createMerchant.mer_name }}
                        </template>
                    </el-table-column>
                    <el-table-column fixed="right" label="操作" width="100">
                        <template slot-scope="scope">
                            <el-button v-if="tableFrom.type == 1" @click="deletClick(scope.row.id)" type="text"
                                size="small">删除</el-button>
                            <router-link v-if="tableFrom.type == 2"
                                :to="{ path: roterPre + '/product/list/addProduct/' + scope.row.product_id + '?isxfk=1' }">
                                <el-button type="text" size="small" class="mr10">采集</el-button>
                            </router-link>
                            <!-- <el-button v-if="tableFrom.type == 2" @click="collection(scope.row.product_id)" type="text"
                                size="small">商品采集</el-button> -->
                        </template>
                    </el-table-column>
                </el-table>
            </div>
            <div class="bottom clearfix">
                <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
                    :current-page="FormData.page" :page-sizes="[10, 20, 30, 50]" :page-size="FormData.limit"
                    layout="total, sizes, prev, pager, next, jumper" :total="total" style="float: right;margin-top:10px;">
                </el-pagination>
            </div>
        </el-card>
    </div>
</template>
<script>
import {
    myaddSharing,
    deleteSharing,
    receiveSharing
} from '@/api/product'

import { roterPre } from '@/settings'
export default {
    name: 'sharing',
    data() {
        return {
            tableFrom: {
                type: '1'
            },
            roterPre: roterPre,
            FormData: {
                page: 1,
                limit: 10,
                product_id: ""
            },
            sharingList: [],
            
        }
    },
    created() {
        this.getList()
        
    },
    methods: {
        handleSizeChange(val){
            this.FormData.limit = val
            this.getList()
        },
        handleCurrentChange(status){
            this.FormData.page = status;
            this.getList()
        },
        switchGetList(tab) {
            this.tableFrom.type = tab.name
            this.getList()
        },
        getList() {
            this.sharingList = []
            if (this.tableFrom.type == 1) {
                myaddSharing(this.FormData).then(res => {
                    this.total = res.data.count
                    this.sharingList = res.data.list
                    console.log(res, '我分享的列表');
                })
            } else if (this.tableFrom.type == 2) {
                receiveSharing(this.FormData).then(res => {
                    this.total = res.data.count
                    this.sharingList = res.data.list
                    console.log(res, '我收到的');
                })
            }

        },
        deletClick(id) {
            this.$confirm('此操作将永久删除该内容, 是否继续?', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            }).then(() => {
                deleteSharing({
                    ids: id
                }).then(res => {
                    this.getList()
                    this.$message({
                        type: 'success',
                        message: '删除成功!'
                    });
                })

            }).catch(() => {
                this.$message({
                    type: 'info',
                    message: '已取消删除'
                });
            });

        }
    },
}
</script>